;(function($){
	// define TC DataGrid
	$.DataGrid=$.Widget.extend({
		init: function(datagrid){
			this.el=$($(datagrid.el).get(0));$.id(this.el);
			this.elHtml=$.getHtml(this.el);
			this.checkable=datagrid.checkable===true?true:false;
			this.gridData=datagrid.data;
			this.header=datagrid.header;
			this.dataMap={};
			this.gridUrl=datagrid.url;
			this.click=$.isFunction(datagrid.click)?datagrid.click:$.noop;
			this.dblclick=$.isFunction(datagrid.dblclick)?datagrid.dblclick:$.noop;
			this.dataGridContent=this.dataGridHeader=this.dataGridFooter=this.currentSelected=null;
			this.totalCount=0; this.pageSize=10; this.currentPageNo=1; this.totalPage=0; this.start=0; this.end=0;
			this.checkAll=[]; this.checkboxes=[];
			this.width=this.el.width()-(this.el.outerWidth(true)-this.el.innerWidth());
			this.height=this.el.css('height')=='auto'?'315':(this.el.height()-this.el.outerHeight(true)+this.el.innerHeight());
			this.boxModel=$.support.boxModel;
			this.scrollBarWidth=this.boxModel?20:0; this.checkWidth=this.isCheckable()?18:0; this.seqWidth=18;
			this.el.css({width:this.width,height:this.height});
			this.el.data('grid',this);
			this.bind();
		},show: function(){
			this.loadData();
			var html=''.concat('<div class="TC DataGrid">',this.genHeader(),this.genContent(),this.genFooter(),'</div>');
			this.el.empty().append(html);
			this.bindScroll();
			this.getCheckbox();
			return this;
		},getEl: function(){
			return this.el;
		},isCheckable: function(){
			return this.checkable;
		},getCheckbox:function(){
			if(this.isCheckable()){
				var checkAll=[];
				this.getEl().find('.DataGridHeader_checkall :checkbox').each(function(){
					checkAll.push(this);
				});
				delete this.checkAll; this.checkAll=checkAll;
				checkAll=[];
				this.getEl().find('.DataGridContentText :checkbox').each(function(){
					checkAll.push(this);
				});
				delete this.checkboxes; this.checkboxes=checkAll;
			}
		},bindScroll: function(){
			this.dataGridHeader=this.el.find('.DataGridHeader:first');
			this.dataGridContent=this.el.find('.DataGridContent:first');
			this.dataGridFooter=this.el.find('.DataGridFooter:first');
			this.dataGridContent.bind('scroll',this,function(event){
				var dataGrid=event.data;
				dataGrid.dataGridHeader.scrollLeft(dataGrid.dataGridContent.scrollLeft());
			});
		},bind: function(){
			this.el.bind('dblclick',this,function(event){
				var el=$(event.srcElement||event.target);
				var grid=event.data;
				if(el.is('.DataGridContent tr *')){
					var tr=el.parents('tr:first');
					var data=grid.dataMap[tr.attr('gid')||''];
					grid.dblclick.call(grid,data,event);
				}
			});
			this.el.bind('click',this,function(event){
				var el=$(event.srcElement||event.target);
				var grid=event.data;
				if(grid.isCheckable() && el.is(':checkbox')){
					var checked=el.is(":checked");
					if(el.is('.DataGridHeader_checkall :checkbox')){
						for(var i=0;i<grid.checkboxes.length;i++){
							grid.checkboxes[i].checked=checked?'checked':'';
						}
					}else if(el.is('.DataGridContentText :checkbox')){
						var allCheck=grid.checkboxes.length>0;
						for(var i=0;i<grid.checkboxes.length;i++){
							if(!grid.checkboxes[i].checked){
								allCheck=false;
								break;
							}
						}
						for(var i=0;i<grid.checkAll.length;i++){
							grid.checkAll[i].checked=allCheck?'checked':'';
						}
					}
				}else if(el.is('.DataGridContent tr *')){
					for(var i=0;i<grid.checkAll.length;i++){
						grid.checkAll[i].checked='';
					}
					for(var i=0;i<grid.checkboxes.length;i++){
						grid.checkboxes[i].checked='';
					}
					var tr=el.parents('tr:first');
					tr.find(':checkbox:first').click();
					if(grid.currentSelected){grid.currentSelected.removeClass('DataGridSelected');}
					grid.currentSelected=tr.addClass('DataGridSelected');
					
					var data=grid.dataMap[tr.attr('gid')||''];
					grid.click.call(grid,data,event);
				}else if(el.is('.jumpto')){
					var j=parseInt(el.prev().val());
					grid.currentPageNo=j>grid.totalPage?grid.totalPage:j>0?j:0; grid.reload();
				}else if(el.is('.icon.first')){
					if(grid.currentPageNo>1){
						grid.currentPageNo=1; grid.reload();
					}
				}else if(el.is('.icon.prev')){
					if(grid.currentPageNo>1){
						grid.currentPageNo-=1; grid.reload();
					}
				}else if(el.is('.icon.next')){
					if(grid.totalPage-grid.currentPageNo>0){
						grid.currentPageNo+=1; grid.reload();
					}
				}else if(el.is('.icon.last')){
					if(grid.totalPage-grid.currentPageNo>0){
						grid.currentPageNo=grid.totalPage; grid.reload();
					}
				}
			});
		},setPageProp: function(){
			var data=this.gridData;
			this.totalCount=parseInt(data.totalCount)||0; 
			this.pageSize=parseInt(data.pageSize)||10;
			this.currentPageNo=parseInt(data.currentPageNo)||1;
			this.start=(this.currentPageNo>1?this.currentPageNo-1:0)*this.pageSize;
			this.end=this.totalCount>this.start+this.pageSize?this.start+this.pageSize:this.totalCount;
			this.totalPage=parseInt((this.totalCount+this.pageSize-1)/this.pageSize);
		},loadData: function(){
			if(this.gridUrl){
				var data;
				$.json(this.gridUrl,{pageSize:this.pageSize,currentPageNo:this.currentPageNo},true,function(json){
					data=json;
				});
				this.gridData=data||[];
			}
			this.setPageProp();
			return this.gridData;
		},genHeader: function(){
			var headerHtml='';
			var header=this.header;
			var width=0;
			for(var i=0;i<header.length;i++){
				width+=(header[i].width=parseInt(header[i].width)||30);
			}
			if(width<this.width){
				for(var i=0;i<header.length;i++){
					header[i].width=parseInt(header[i].width*(this.width-this.scrollBarWidth-(this.isCheckable()?this.checkWidth:0)-this.seqWidth-18)/(width||1))||0;
				}
			}
			if(this.seqWidth>0){
				headerHtml=headerHtml.concat('<th><div class="DataGridHzeaderText SEQ" style="width:',this.seqWidth,'px;padding:3px 4px 3px 5px;">&nbsp;</div></th>');
			}
			if(this.isCheckable()){
				headerHtml=headerHtml.concat('<th><div class="DataGridHzeaderText DataGridHeader_checkall" style="width:',this.checkWidth,'px;padding:3px 4px 3px 5px;"><input class="CA" type="checkbox" name="DataGridHeader_checkall"></div></th>');
			}
			for(var i=0;i<header.length;i++){
				width=header[i].width; width=(width&&this.boxModel?width:(width-2/*IE Fix*/))-1/*th border*/;
				var txtW=width&&this.boxModel?(width-9/*padding*/):width;
				headerHtml=headerHtml.concat('<th',i==(header.length-1)?' class="last"':'','><div class="DataGridHzeaderText DataGridHeader_',header[i].name||'','" style="width:',txtW,'px;padding:3px 4px 3px 5px;">',header[i].text||'','</div></th>');
			}
			headerHtml=''.concat('<div class="DataGridHeader" style="width:',this.width-this.scrollBarWidth,'px;height:25px;padding:0px 20px 0px 0px;"><table align="left" cellpadding="0" cellspacing="0" style="padding:0px 20px 0px 0px;-padding:0;"><thead><tr>',headerHtml,'</tr></thead></table></div>');
			return headerHtml;
		},genContent: function(){
			var contentHtml='', data=this.gridData.data||[], width=0, id=$.id(this.el);
			for(var k in this.dataMap){delete this.dataMap[k];}
			for(var i=0;i<data.length;i++){
				var row = data[i], rowHtml='';
				this.dataMap[row.id||'']=row;
				if(this.seqWidth>0){
					rowHtml=rowHtml.concat('<td><div class="DataGridContentText SEQ" style="width:',this.seqWidth,'px;padding:3px 4px 3px 5px;">',i,'</div></td>');
				}
				if(this.isCheckable()){
					rowHtml=rowHtml.concat('<td><div class="DataGridContentText DataGridContent_checkbox" style="width:',this.checkWidth,'px;padding:3px 4px 3px 5px;"><input class="CB" type="checkbox" name="DataGridHeader_checkbox"></div></td>');
				}
				for(var j=0;j<this.header.length;j++){
					width=this.header[j].width; width=(width&&this.boxModel?width:(width-2/*IE Fix*/))-1/*td border*/;
					var txtW=width&&this.boxModel?(width-9/*padding*/):width;
					rowHtml=rowHtml.concat('<td',j==(this.header.length-1)?' class="last"':'','><div class="DataGridContentText DataGridContent_',this.header[j].name||'','" style="width:',txtW,'px;padding:3px 4px 3px 5px;" title="',row[this.header[j].name||'']||'','">',row[this.header[j].name||'']||'','</div></td>');
				}
				contentHtml=contentHtml.concat('<tr onmouseover="datagrid_onmouseover(this);" onmouseout="datagrid_onmouseout(this);" gid="',row.id,'">',rowHtml,'</tr>');
			}
			contentHtml=''.concat('<div class="DataGridContent" style="width:',this.width,'px;height:',$.isNumber(this.height)?(this.height-25-26)+'px;':this.height,'"><table align="left" cellpadding="0" cellspacing="0"><tbody>',contentHtml,'</tbody></table></div>');
			return contentHtml;
		},genFooter: function(){
			var footerHtml=''.concat('<div class="DataGridFooter Pagination" style="width:',this.width,'px;height:24px;"><table cellpadding="0" cellspacing="0" width="100%"><tr style=" height:24px;">'
					,'<td align="left" valign="middle">每页显示条数：',this.pageSize,'&nbsp;&nbsp;显示 ',this.start,' - ',this.end,'条，共 ',this.totalCount,' 条</td>'//<select class="pageSize" style="font-size:12px;"><option value="5">5</option><option value="10">10</option><option value="20">20</option><option value="30">30</option></select>
					,'<td align="right" valign="middle"><button class="icon first" title="首页"></button><button class="icon prev" title="上一页"></button><input type="text" size="2" value="',this.currentPageNo,'" onkeyup="this.value=parseInt(this.value)||1;">/',this.totalPage,'<button style="font-size:12px; height:22px;" class="jumpto">跳转</button><button class="icon next" title="下一页"></button><button class="icon last" title="尾页"></button></td><tr></table></div>');
			return footerHtml;
		},reload: function(){
			this.loadData();
			var html=this.genContent()+this.genFooter();
			this.el.find('.DataGridContent, .DataGridFooter').unbind('scroll').remove();
			this.el.find('.DataGridHeader:first').after(html);
			this.bindScroll();
			this.getCheckbox();
			for(var i=0;i<this.checkAll.length;i++){
				this.checkAll[i].checked='';
			}
		},destroy:function(){
			$.each('click mousedown mousemove mouseup mousedown contextmenu'.split(' '),function($el){
				$el.unbind(this);
			},this.el);
			this.el.replaceWith(this.elHtml);
			$.removeObj(this);
		}
	});
})(jQuery);
var datagrid_onmouseover=function(obj){jQuery(obj).addClass('DataGridHover');};
var datagrid_onmouseout=function(obj){jQuery(obj).removeClass('DataGridHover');};
